<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1，user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="css/reset.css"/>
    <link rel="stylesheet" type="text/css" href="css/template.css"/>
    <title>首页</title>

  
</head>
<style>

</style>
<body>
        <div class="web">

                <header>
                        <div class="top_content">
                                   <div class="menu">
                                       <div class="line"></div>
                                       <div class="line"></div>
                                       <div class="line"></div>
                                   </div>
                                   <div class="logo"><img src="img/logo.png"></div>
                                   <div class="search"><img src="img/search.png"></div>
                        </div>

                </header>

                <div class="main">

                </div>

                <footer>
                    <div>
                        <div>
                            <a href="index.html">
                                    <img src="img/shouye.png">
                            </a>
                            
                        </div>
                        <p>
                            <a href="index.html">首页 </a>
                        </p>
                    </div>

                    <div class="f_line">
                        <div>
                            <a><img src="img/cimc.png"></a>
                        </div>
                        <p><a href="GIMC_index.html">CIMC</a></p>
                    </div>

                    <div class="f_line">
                        <div>
                            <a href="wenzhang_1.html"><img src="img/wenzhang2.png"></a>
                        </div>
                        <p><a href="wenzhang_1.html">文章</a></p>
                    </div>

                    <div class="f_line">
                        <div>
                            <a href="ziyuan1.html"><img src="img/ziyuan.png"></a>
                        </div>
                        <p><a href="ziyuan1.html">资源</a></p>
                    </div>
                    <div class="f_line">
                        <div>
                            <a href="keceng.html"><img src="img/xueyuan.png"></a>
                        </div>
                        <p><a href="keceng.html">学院</a></p>
                    </div>
            </footer>

        </div>
</body>

<script>
  
/*动态改变根元素字体大小*/
function recalc() {
	var clientWidth = document.documentElement.clientWidth;
	if(!clientWidth) return;
	document.documentElement.style.fontSize = 40 * (clientWidth / 640) + 'px';
}

function initRecalc() {
	recalc();
	var resizeEvt = 'osrientationchange' in window ? 'orientationchange' : 'resize';
	if(!document.addEventListener) return;
	window.addEventListener(resizeEvt, recalc, false);
	document.addEventListener('DOMContentLoaded', recalc, false);
}
initRecalc();

 console.log("手机viewportWidth=",document.documentElement.clientWidth);
    //获取viewport宽
    var viewportWidth = document.documentElement.clientWidth;
    console.log(document.documentElement.style.fontSize);
</script>

</html>